<nav role="navigation" class="navbar navbar-default"
	ng-controller="UserController">
	<!-- Brand and toggle get grouped for better mobile display -->
	<div class="navbar-header">
		<button type="button" data-target="#navbarCollapse"
			data-toggle="collapse" class="navbar-toggle">
			<span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span>
			<span class="icon-bar"></span> <span class="icon-bar"></span>
		</button>
		<a href="#" class="navbar-brand">My Shares</a>
	</div>
	<!-- Collection of nav links, forms, and other content for toggling -->
	<div id="navbarCollapse" class="collapse navbar-collapse">
		<ul class="nav navbar-nav">
			<li class="active"><a href="#">Home</a></li>
			<li><a href="#">Profile</a></li>
			<li><a href="#">Portfolio</a></li>
		</ul>
		<form role="search" class="navbar-form navbar-left">
			<div class="form-group">
				<input type="text" placeholder="Search for Instrument's data"
					class="form-control">
			</div>
		</form>
		<ul class="nav navbar-nav navbar-right">
			<li ng-show="logged"><a class="dropdown-toggle"
				data-toggle="dropdown">{{username}} <b class="caret"></b></a>
				<ul class="dropdown-menu" style="padding: 15px; min-width: 85px;">
					<li ng-show="logged"><a ng-click="logout()">Logout</a></li>
				</ul></li>
			<li class="dropdown" ng-hide="logged"><a class="dropdown-toggle"
				data-toggle="dropdown">Sign in <b class="caret"></b></a>
				<ul class="dropdown-menu" style="padding: 15px; min-width: 250px;">
					<li ng-hide="logged">
						<div class="row">
							<div class="col-md-12">
								<form class="form" role="form" id="login-nav"
									ng-submit="login()">
									<div class="form-group">
										<label class="sr-only" for="username">Username</label> <input
											type="text" class="form-control" id="username"
											placeholder="Username" name="username" required
											ng-model="username">
									</div>
									<div class="form-group">
										<label class="sr-only" for="password">Password</label> <input
											type="password" class="form-control" id="password"
											placeholder="Password" name="password" required
											ng-model="password">
									</div>
									<div class="checkbox">
										<label> <input type="checkbox"> Remember me
										</label>
									</div>
									<div class="form-group">
										<button type="submit" class="btn btn-success btn-block">Sign
											in</button>
									</div>
								</form>
							</div>
						</div>
					</li>
					<li class="divider"></li>
					<li><input class="btn btn-primary btn-block" type="button"
						id="sign-in-google" value="Sign In with Google" ng-click="loginSocial()"> <input
						class="btn btn-primary btn-block" type="button"
						id="sign-in-twitter" value="Sign In with Twitter"></li>
				</ul></li>
		</ul>
	</div>
</nav>